<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@include file="../commons/commons.jsp"%>
<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>修改用户头像</title>
  	<link href="${ctx }/plugins/cutavatar/cropper.css" rel="stylesheet"><!--矩形框-->
  	<link href="${ctx }/plugins/cutavatar/main.css" rel="stylesheet">
  	<link href="${ctx}/css/bootstrap.min.css" rel="stylesheet">
    <link href="${ctx}/css/font-awesome.min.css" rel="stylesheet">
    <link href="${ctx}/css/prettyPhoto.css" rel="stylesheet">
    <link href="${ctx}/css/animate.min.css" rel="stylesheet">
	<link href="${ctx}/css/main.css" rel="stylesheet">
    <link href="${ctx}/css/responsive.css" rel="stylesheet">
    <link href="${ctx}/css/gj.css" rel="stylesheet">
  	<style type="text/css">
		
  	</style>
</head>
<body>

<%
		//禁止页面缓存
		response.addHeader("Cache-Control", "no-store, must-revalidate");
		response.addHeader("Expires", "Thu, 01 Jan 1970 00:00:01 GMT");
	%>
  <nav class="navbar navbar-default navbar-fixed-top navbar-inverse" >
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#"><img src="${ctx}/favicon/logo.png" style="margin-top: -10px;width: 150px;height:50px" /></a>
        </div>
      </div>
    </nav>
  </div>
  <div style="width:50px;height:80px"></div>

  <div class="container">
    <div class="row">
      <div class="col-md-9">
        <!-- <h3 class="page-header">Demo:</h3> -->
        <div class="img-container">
          <img src="${COMMONUSER.headimgUrl }" alt="Picture">
        </div>
      </div>
      <div class="col-md-3">
        <!-- <h3 class="page-header">Preview:</h3> -->
        <div class="docs-preview clearfix">
          <div class="img-preview preview-lg"></div>
          <div class="img-preview preview-md"></div>
          <div class="img-preview preview-sm"></div>
          <div class="img-preview preview-xs"></div>
        </div>
		<input type="hidden" id="uid" name="id" value="${COMMONUSER.id}" />
        <!-- <h3 class="page-header">Data:</h3> -->
        <div class="docs-data">
          <div class="input-group">
            <label class="input-group-addon" for="dataX">X</label>
            <input class="form-control" id="dataX" type="text" placeholder="x" disabled>
            <span class="input-group-addon">px</span>
          </div>
          <div class="input-group">
            <label class="input-group-addon" for="dataY">Y</label>
            <input class="form-control" id="dataY" type="text" placeholder="y" disabled>
            <span class="input-group-addon">px</span>
          </div>
          <div class="input-group">
            <label class="input-group-addon" for="dataWidth">Width</label>
            <input class="form-control" id="dataWidth" type="text" placeholder="width" disabled>
            <span class="input-group-addon">px</span>
          </div>
          <div class="input-group">
            <label class="input-group-addon" for="dataHeight">Height</label>
            <input class="form-control" id="dataHeight" type="text" placeholder="height" disabled>
            <span class="input-group-addon">px</span>
          </div>
          <div class="input-group">
            <button class="btn btn-default submitdata GJBlackbutton" style="margin-top:20px;margin-left:100px">确认修改</button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- 页脚模块 -->
   	<%@include file="../front/frontfoot.jsp"%>
   	
	  <script src="${ctx }/plugins/cutavatar/cropper.js"></script>
	  <script src="${ctx }/plugins/cutavatar/main.js"></script><!--矩形框-->
	  <script src="${ctx}/js/url.js"></script>
</body>
<script>
		$(document).ready(function(){
			$(".submitdata").click(function(){
				$.ajax({
 	       			 type : 'GET',
 	        		 url : url.server+param.cutavatar,
 	        		 data : {
	                	dataX:$("#dataX").val(),
	                	dataY:$("#dataY").val(),
	                	dataWidth:$("#dataWidth").val(),
	                	dataHeight:$("#dataHeight").val(),
	                	uid:$("#uid").val()
 	            	},
 	        		success : function (response, stutas, xhr) {
 	        			if(response.status=='1'){
 	        				//跳转到个人信息
 	        				alert("修改头像成功");
 	        				window.location.href="${ctx }/commonuser/userInfo.do";
 	        			}else{
 	        				alert("修改头像失败，请稍后重新操作");
 	        				window.location.href="${ctx }/commonuser/loginOut.do";
 	        			}
 	        		}
 	      	});
		});
	})
	</script>
</html>